<template>
    <!--容器大小-->
    <div id="excel">
       <!-- <h2>选择日期</h2>
        <div style="margin-bottom:10px">
            <Label for="c1">从</Label>
            <ComboBox inputId="c1" style="width:180px"
                      :data="startDataOptions"
                      v-model="startData"
                      :editable="false"
                      :panelStyle="{height:'auto'}">
            </ComboBox>
            <Label for="c2">至</Label>
            <ComboBox inputId="c2" style="width:180px"
                      :data="endDataOptions"
                      v-model="endData"
                      :editable="false"
                      :panelStyle="{height:'auto'}">
            </ComboBox>
        </div>-->
        <div id="main">
            <DataGrid style="height:600px;"
                      :pagination="true"
                      :data="data"
                      :total="total"
                      :pageSize="pageSize"
                      :startDataOptions="startDataOptions"
                      :endDataOptions="endDataOptions">
                <GridColumn field="itemid" title="ID" :sortable="true" align="center"></GridColumn>
              <!--  <GridColumn field="WD" title="温度" :sortable="true"></GridColumn>
                <GridColumn field="GQ" title="光强" align="right" :sortable="true"></GridColumn>-->
                <GridColumn field="SD" title="湿度" align="center" :sortable="true" ></GridColumn>
                <GridColumn field="DATA" title="时间" align="center" :sortable="true" ></GridColumn>
            </DataGrid>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                total: 1000,
                data: [],
                pageSize: 10,
                data1:[],
                data2:[],
                startData: '2021-11-06 00:00:00',
                endData:'2021-11-15 15:00:00',
                data11: '2021-10-11 16:00:00',
                data22: '2021-10-17 15:00:00',
                startDataOptions: [
                    { value: "2021-10-11 00:00:00", text: "2021-10-11" },
                    { value: "2021-10-12 00:00:00", text: "2021-10-12" },
                    { value: "2021-10-13 00:00:00", text: "2021-10-13" }
                ],
                endDataOptions: [
                    { value: "bottom", text: "Bottom" },
                    { value: "top", text: "Top" },
                    { value: "both", text: "Both" }
                ],

            };
        },

    mounted() {
            this.getData();

    },
        methods:{
            getData(){
                const axios = require('axios');
                axios.get('http://47.113.217.47:9095/SmartAG/view/viewTodayHumidity', {
                    params: {
                        date1: this.startData,
                        date2: this.endData,
                    }
                }).then(result=>
                    {
                        function renderTime(date) {
                            var dateee = new Date(date).toJSON();
                            return new Date(+new Date(dateee) + 0 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '')
                        }
                        console.log("获取最新的数据excel")
                        console.log(result.data)
                        console.log("获取最新的数据excel")
                        for (let i = 0; i <= result.data.length; i++) {
                            let id = result.data[i].id;
                            // let wd = result.data[i].temperatureData;
                            // let gq = result.data[i].lightData;
                            let sd = result.data[i].humidity;
                            let data = renderTime(result.data[i].date);
                            this.data.push({
                                itemid: id,
                                // WD: wd,
                                // GQ: gq,
                                SD: sd,
                                DATA:data
                            });
                        }
                    }
                );
            }
            },

    }
</script>

<style scoped>
    #excel{
        float: left;
        width: 1453px;
        /* width: 100%;*/
        height: 600px;
    }
</style>
